﻿@model SILAS.Entidades.SAP

@{
	ViewBag.Title = "Create";
	Layout = "~/Views/Shared/_layoutGeneral.cshtml";
}

	
	<link rel="stylesheet" href="/resources/demos/style.css" />

	<script type="text/javascript">
	    // increase the default animation speed to exaggerate the effect
	    $.fx.speeds._default = 1000;
	    $(function () {
	        $("#dialog").dialog({
	            autoOpen: false,
	            show: "blind",
	            hide: "explode",
	            modal: true
	        });

	        $("#opener").button().click(function () {
	            $("#dialog").load('/FuenteAgua/_Create');
	            $("#dialog").dialog("open");
	            return false;
	        });
	    });
	</script>

	<script type="text/javascript">


		$(function () {

			$("#FecConstruccion").datepicker({
				changeMonth: true,
				changeYear: true,
				dateFormat: "yy-mm-dd",
				yearRange: "1950:2012"
				
			});

			$("#btnGuardar").click(function () {

				var data = $('form').serialize();
				
			  
				$.post('@Url.Action("Create", "SAP")',
						 data,
						 function (ok) {
							 if (ok) {
								 if (ok.exito == true) {
								     alert(ok.msg);

								     window.location = '@Url.Action("Index", "SAP")'+'/index/'+@ViewBag.id;
								 }
								 else {
									 alert(ok.msg);
								 }
							 }
						 }, "json");
			});

			var FuenteDA;

			$("#txtBuscarFuenteA").autocomplete({
				source: '@Url.Action("GetFuenteAgua", "FuenteAgua")',
				minLength: 1,
				focus: function (event, ui) {
					var select = ui.item;
					$("#txtBuscarFuenteA").val(select.label);
					return false;
				},
				select: function (event, ui) {
					var select = ui.item;
					$("#txtBuscarFuenteA").val(select.label);
					FuenteDA = select.FuenteDA;
					return false;
				}
			});

			$("#add2").click(function (e) {
				e.preventDefault();

				var row = $("#tblFuente >tbody >tr").length;

				if (row == 0) {
					var filaTable = '<tr>';
					filaTable += '<td> <input type=\"hidden\" name=\"FuenteAguas[' + row + '].Id\" value=\"' + FuenteDA.IdFuenteAgua + '\" />' + FuenteDA.Denominacion + '</td>';
					filaTable += '<td>' + FuenteDA.Duenio + '</td>';
					filaTable += '<td>' + FuenteDA.Caudal + '</td>';
					filaTable += '<td>' + FuenteDA.TipoFuente + '</td>';
					filaTable += '<td>' + FuenteDA.Ubicacion + '<td><a href=\"#\" class =\"deletempli\"><img src=\"/Content/Imagenes/delete.png\" alt=\"Eliminar Fuente\" /></a></td>';
					filaTable = filaTable + '</tr>';

					$("#tblFuente tbody").append(filaTable).fadeIn("slow");
				}
				else {
					var sinErrores = true;

					$("#tblFuente  tbody tr td:nth-child(1)").each(function (index, element) {
						var IdFuenteAgua = $(element).find("input:eq(0)").val();
						if (IdFuenteAgua == FuenteDA.IdFuenteAgua) {
							sinErrores = false;
							return;
						}
					});

					if (sinErrores) {
						var filaTable = '<tr>';
						filaTable += '<td> <input type=\"hidden\" name=\"FuenteAguas[' + row + '].Id\" value=\"' + FuenteDA.IdFuenteAgua + '\" />' + FuenteDA.Denominacion + '</td>';
						filaTable += '<td>' + FuenteDA.Duenio + '</td>';
						filaTable += '<td>' + FuenteDA.Caudal + '</td>';
						filaTable += '<td>' + FuenteDA.TipoFuente + '</td>';
						filaTable += '<td>' + FuenteDA.Ubicacion + '<td><a href=\"#\" class =\"deletempli\"><img src=\"/Content/Imagenes/delete.png\" alt=\"Eliminar Fuente\" /></a></td>';
						filaTable = filaTable + '</tr>';

						$("#tblFuente tbody").append(filaTable).fadeIn("slow");
					}
					else {
						alert('La fuente ya se agregó, seleccione otra fuente ');
					}

				}
				  document.getElementById("txtBuscarFuenteA").value = "";
			});


			$(".deletempli").live("click", function (e) {
				e.preventDefault();

				var tr = $(this).parents("tr");

				$(tr).fadeOut("slow", function () {
					$(tr).remove();

					$("#tblFuente  tbody tr").each(function (index, element) {
						var fila = $(element);
						$(fila).find('input[name$="IdFuenteAgua"]').attr("name", "FuenteAguas[" + index + "].IdFuenteAgua");
					});
				});
			});


		});

	</script>
  
 



<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.ui.datepicker.js")" type="text/javascript"></script>


@using (Html.BeginForm())
{
	@Html.ValidationSummary(true)
	<fieldset>
		<legend><h3>Registrar SAP</h3></legend>
		<div id='left' class='ui-widget ui-corner-all' style='float:left;width:35%;margin-top:0.5em;margin-left:0.5em;'>
		<div class="ui-widget-header ui-corner-top" style="padding:0.3em;">
			Información General
		</div>
		<div class="ui-widget-content ui-corner-bottom" style="padding:0.5em;">
 
	  @*  <div class="editor-label">
			@Html.Label("Seleccionar SAP")
		</div>
		<div class="editor-field">
			@Html.DropDownList("IdSector")
			
		</div>*@
 
			<input type="hidden" id="id" name="Sectors[0].Id" value=@ViewBag.id />
 
		<div class="editor-label">
			@Html.HiddenFor(model => model.Id)
		<b>	@Html.LabelFor(model => model.Nombre)</b>
		</div>
		<div class="editor-field">
			@Html.EditorFor(model => model.Nombre)
			@Html.ValidationMessageFor(model => model.Nombre)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Fecha de Construcción")</b>
		</div>
		<div class="editor-field">
			
			
			@Html.TextBoxFor(model => model.FecConstruccion, new { @id = "FecConstruccion" })
			@Html.ValidationMessageFor(model => model.FecConstruccion)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Número de Piletas Públicas")</b>
		</div>
		<div class="editor-field">
			@Html.EditorFor(model => model.NroPilPublicas)
			@Html.ValidationMessageFor(model => model.NroPilPublicas)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Número Familias Beneficiadas")</b>
		</div>
		<div class="editor-field">
			@Html.EditorFor(model => model.NroFamBenef)
			@Html.ValidationMessageFor(model => model.NroFamBenef)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Monto de Inversión")</b>
		</div>
		<div class="editor-field">
			@Html.EditorFor(model => model.MontoInversion)
			@Html.ValidationMessageFor(model => model.MontoInversion)
		</div>
 
		<div class="editor-label">
	   
			<b>@Html.Label("Se Clora?")</b>
		</div>
		<div class="editor-field">
			<label>@Html.RadioButtonFor(model => model.SeClora, true) Si</label> 
			|<label>@Html.RadioButtonFor(model => model.SeClora, false) No</label> 
			 @Html.ValidationMessageFor(model => model.SeClora)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Institución Supervisora")</b>
		</div>
		
		<div class="editor-field">
			@Html.DropDownList("IdInstSupervisora")
			@Html.ValidationMessageFor(model => model.IdInstSupervisora)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Institución Ejecutora")</b>
		</div>
		<div class="editor-field">
			@Html.DropDownList("IdInstEjecutora")
			@Html.ValidationMessageFor(model => model.IdInstEjecutora)
		</div>
 
		<div class="editor-label">
			<b>@Html.Label("Tipo de SAP")</b>
		</div>
		<div class="editor-field">
			@Html.DropDownList("IdTipoSAP")
			@Html.ValidationMessageFor(model => model.IdTipoSAP)
		</div>
		</div>
	</div>

	
 <div id='right' class='ui-widget ui-corner-all' style='float:left;width:60%;margin-top:0.5em;margin-left:0.5em;'>
	   
			<div class="ui-widget-header ui-corner-top" style="padding:0.3em;">
				Fuentes de Agua
			</div>
			<div class="ui-widget-content ui-corner-bottom" style="padding:0.5em;">
		
			 <table id="tblFuente" border="1" cellpadding="0" cellspacing="0">
				<thead>
				 <tr>
					<th>
						Denominacion
					</th>
					<th>
						Dueño
					</th>
					<th>
						Caudal
					</th>
					<th>
					   TipoFuente
					</th>
					<th>
						Altura
					</th>
					
		
				</tr>
			  </thead>

			 <tbody>                   
				  
			</tbody>  
			
			</table>

			@Html.Label("Buscar Fuente Agua:")
			@Html.TextBox("txtBuscarFuenteA")
			<button id="add2">Añadir Fuente de Agua</button>
			</div>
		</div>
		<br />
		<br />
		<br />
		
		<button id="opener" align:"right">Crear Nueva Fuente</button>
	  
		

		 <p style='clear:both;margin-top:10em;padding:1em;'>
			<!--input type="submit" value="Save" /-->
			<button id="btnGuardar" type="button">Guardar SAP</button> 
		</p>
	</fieldset>
	
	<div id="dialog" title="Crear Fuente de Agua">
	    @*@Html.Partial("~/Views/FuenteAgua/_Create.cshtml")*@
	</div>
} 

<a href="@Url.Action("Index", "SAP", new { id = @ViewBag.id })">
			   <img src="@Url.Content("~/Content/Imagenes/volver.jpg")" title="Volver a Listar SAP" alt="Volver a Listar SAP" />
			</a>
